<!--
 * @description  : 航空运输
 * @descriptionDetail: 案件-运输信息-航空运输
 * @copyright    : 浙江烟草
 * @author       : sy
 * @create       : 2022-10-09 18:43:02
-->
<template>
  <view class="page">
    <!-- #ifdef H5-ONLY -->
    <theme-navbar :isWhite="true" backText="返回" :title="typeInfo.typeName"></theme-navbar>
    <!-- #endif -->
    <view class="content">
      <view class="party-info-content">
        <view style="width: calc(100% + 30px);">
          <form-section title="基本信息"></form-section>
        </view>
        <view class="party-info-box">
          <u-form :model="involvedForm" :rules="rules" :errorType="errorType" ref="uForm">
            <u-form-item label="班次名称" class="caseAviaClass" :label-position="labelPosition" :required="isTrue" prop="serviceName">
              <!-- <u-input v-model="involvedForm.serviceName" @input="shipInfo" placeholder="请输入班次名称" :disabled="isDisabled" /> -->
              <auto-input absIndex="1" :searchData="shipInfo" absClass="caseAviaClass" :disabled="isDisabled" placeholder="请输入班次名称" v-model="involvedForm.serviceName" @choiceAutoItem="choiceAutoItem">
              </auto-input>
            </u-form-item>
            <u-form-item label="登记单位" :label-position="labelPosition" :required="true" prop="orgName" right-icon="arrow-right">
              <u-input
                :disabled="true"
                placeholder="请选择"
								:custom-style="pointerStyle"
                v-model="involvedForm.orgName"
                @click="orgSelectShow = true"
              >
              </u-input>
            </u-form-item>
            <u-form-item label="始发站" :label-position="labelPosition" prop="startStation">
              <u-input placeholder="请输入" :disabled="isDisabled" v-model="involvedForm.startStation" />
            </u-form-item>			
            <!--   <u-form-item label="查获地数" :label-position="labelPosition" :required="isTrue" prop="getPlaceCount">
              <u-input placeholder="请输入" :disabled="isDisabled" v-model="involvedForm.getPlaceCount" />
            </u-form-item> -->
            <u-form-item label="案发站" :label-position="labelPosition" :required="isTrue" prop="caseStation">
              <u-input placeholder="请输入" :disabled="isDisabled" v-model="involvedForm.caseStation" />
            </u-form-item>
            
            <u-form-item label="途径站点" :label-position="labelPosition" prop="pathWayStation">
              <u-input placeholder="请输入" :disabled="isDisabled" v-model="involvedForm.pathWayStation" />
            </u-form-item>
            <u-form-item label="终点" :label-position="labelPosition" prop="endStation">
              <u-input placeholder="请输入" :disabled="isDisabled" v-model="involvedForm.endStation" />
            </u-form-item>
            
            <u-form-item label="所属航空公司" :label-position="labelPosition" prop="planeName">
              <u-input placeholder="请填写所属航空公司" :disabled="isDisabled" v-model="involvedForm.planeName" />
            </u-form-item> 
            <u-form-item label="状态" :label-position="labelPosition" prop="statusName">
              <dic-input 
                :keyWord="$u.dic.DIC_KEYS.S_SYS_IS_ACTIVE" 
                :dicCode="involvedForm.status"
                :border="border" 
                type="select"
                :select-open="dicSelectOpen('status',$u.dic.DIC_KEYS.S_SYS_IS_ACTIVE)" 
                placeholder="请选择"
                :disabled="isDisabled"
                v-model="involvedForm.statusName" 
                @changeInputModelData="(name)=>{$set(involvedForm, 'statusName', name)}" 
                @click="showDic($u.dic.DIC_KEYS.S_SYS_IS_ACTIVE,involvedForm.status,'status')"
              />	
            </u-form-item>
            <u-form-item label="始发时间" :label-position="labelPosition" prop="startTime" right-icon="arrow-right">
              <u-input :disabled="true" :custom-style="pointerStyle" placeholder="请选择始发时间" v-model="involvedForm.startTime" @click="()=>{!isDisabled && (isShowDate = true);}" />
            </u-form-item>           
            <u-form-item label="是否伪装" :label-position="labelPosition" prop="pretendStr">
              <dic-input
                :keyWord="$u.dic.DIC_KEYS.S_SYS_YES_NO"
                :dicCode="involvedForm.pretend"
                :border="false"
                type="select"
                :select-open="dicSelectOpen('pretend',$u.dic.DIC_KEYS.S_SYS_YES_NO)"
                placeholder="请选择"
                :disabled="true"
                v-model="involvedForm.pretendStr"
                @changeInputModelData="(name)=>{$set(involvedForm, 'pretendStr', name)}"
                @click="showDic($u.dic.DIC_KEYS.S_SYS_YES_NO,involvedForm.pretend,'pretend')"
              />
            </u-form-item>
            <u-form-item label="图片信息" :label-position="labelPosition">
              <view class="zk-img-content">
                <m-upload
                  :deletable="true"
                  :maxCount="picIds"
                  width="150rpx"
                  height="150rpx"
                  :file-list="fileList"
                  :multiple="true"
                  index="fileList"
                  :uploadParam="{'fiGroupCode':$FILE_GROUP_TYPE.c_case_plane}"
                  upApiUrl="uploadBase64ForApp"
                  ref="filePicUpload"
                  @on-list-change="changeUpload"
                >
                </m-upload>
              </view>
            </u-form-item>
          </u-form>
        </view>
      </view>
      <view class="space-content"></view>
      <view class="submit-btns btn-other-cls">
        <u-button class="u-btn" type="primary" v-if="typeInfo.type!='view'" @click="confirm">
          保存
        </u-button>  
      </view>
      <!-- 组织机构选择 -->
      <u-popup mode="bottom" height="80%" v-model="orgSelectShow">
        <org-select :cleanParentOrg="true" :isHybrid="true" limitNodeType="03" treeType="zm-comp" @choose="handlerChooseOrg"></org-select>
      </u-popup>
      <!-- 字典单选 -->
      <dic-choice
        :keyWord="dicKeyWords"
        :currentSelect="dicCurrentSelect"
        v-model="dicShow"
        @confirm="selectDicConfirm"
      ></dic-choice>
      <u-picker mode="time" :params="paramsDate" v-model="isShowDate" @confirm="changeDate('startTime',$event)">
      </u-picker>
    </view>
  </view>
</template>

<script>
import DicChoice from "@/components/dic_choice.vue";
import DicInput from "@/components/dic_input.vue";
import TcarInfo from "@/declare/case/TcarInfo.js";
import commonService from "@/service/common/common.service";
import caseService from '@/service/case/case.service.js';
// import areaSelect from "@/components/area-select.vue"
import OrgSelect from "@/components/org-select.vue";
import AutoInput from "@/components/autoInput.vue";
import mUpload from '@/components/m-upload.vue';
import FormSection from "@/components/form-section.vue";
export default {
  components:{
    DicChoice,
    // areaSelect,
    // "dic-choice":DicChoice,
    "dic-input":DicInput,
    OrgSelect,
    AutoInput,
    mUpload,
    FormSection,
  },
  data(){
    return {
      nativeNameSelectShow: false,// 行政区选择框是否打开     
      dicType:"car",
      dicShow: false, // dic_select 是否显示
      dicKeyWords: "", // dic 关键字
      dicCurrentSelect: "", // dic 当前选择项
      isDisabled:false, // 表单是否禁用
      involvedForm:{},
      rules:{
        serviceName: [{
          required: true,
          message: '请输入班次名称',
          trigger: ['change', 'blur',],
        },],
        dicCarType: [{
          required: true,
          message: '请选择登记单位',
          trigger: ['change', 'blur',],
        },],
        // getPlaceCount: [{
        //   required: true,
        //   message: '请输入查获地数',
        //   trigger: ['change', 'blur',],
        // },],
        caseStation:[{
          required: true,
          message: '请输入案发站',
          trigger: ['change', 'blur',],
        },],
      },
      errorType: ['border-bottom','message',],
      isTrue: true,
      labelPosition:"top",
      activeColor: this.$u.color['primary'],
      border: false, 
      typeInfo:{},// 类型 添加/编辑
      orgSelectShow: false,
      case_uuid:'',
      fileList: [],
      picIds: '20',
      isShowDate:false, 
      paramsDate: {
        year: true,
        month: true,
        day: true,
        hour: true,
        minute: true,
        second: true,
        timestamp: true,
      },
			// h5端部分浏览器input设置disabled后点击事件失效 2023-10-27 fsx start
			pointerStyle: {
			  marginRight: "5px",
				pointerEvents: "none !important"
			},
			// h5端部分浏览器input设置disabled后点击事件失效 2023-10-27 fsx end
    }
  },
  onReady() {
    this.$refs.uForm.setRules(this.rules);
  },
  // 加载初始周期方法
  onLoad() {
    let prevParam =  this.getRouteParam();
    console.log(prevParam)
    this.involvedForm.caseUuid = prevParam.caseUuid;
    this.case_uuid = prevParam.caseUuid;
    if (prevParam.type) {
      this.typeInfo.type = prevParam.type;
      this.typeInfo.typeName = prevParam.type == 'add' ? "添加航空运输" :  "编辑航空运输";

    } else {
      this.typeInfo = {};
    }
    if(prevParam.param){
      this.involvedForm =  prevParam.param;
      this.involvedForm.pretend = this.involvedForm.pretend + '';
      if (this.involvedForm.photo) {
        let photoArr = this.involvedForm.photo.split(',');
        photoArr.forEach((val) => {
          this.fileList.push({
            gfiId: val,
          });
        });
      }
    }
  },
  mounted() {

  },
  methods:{
    handlerChooseOrg(orgs) {
      this.involvedForm.orgUuid = orgs[0].id;
      this.involvedForm.orgName = orgs[0].name;
      this.orgSelectShow = false;
    },
    dicSelectOpen: function (type,keyWords) {
      if(type == this.dicType){
        if (this.dicKeyWords == keyWords && this.dicShow) {
          return true;
        }
        return false;
      }
    },
    showDic: function (key, cur,type) {
      if (this.dicShow) return;
      this.dicKeyWords = key;
      this.dicCurrentSelect = cur;
      this.dicShow = true;
      this.dicType = type;
    },
    // 获取自定选择的数据（物流公司名称 或 快递公司名称）
    choiceAutoItem(itm, index){
      if(index == '1'){
        this.involvedForm = {... itm,};
        this.involvedForm.caseUuid = this.case_uuid;
      }
    },
    // 获取班次接口
    shipInfo(txt) {
      let self = this;
      let params = {
        page: 1,
        limit: 10,
        name: txt,
      }
      return new Promise((resolve, reject) => {
        if (this.$u.test.isEmpty(txt)) {
          resolve([]);
          return;
        }
        caseService.getCasePlane(params).then(res => {
          res.data.forEach(itm => {
            itm.name = itm.orgName ? [itm.serviceName,].join("") + ' - ' + itm.orgName : [itm.serviceName,].join("");
          });
          resolve(res.data);
        }).catch(er => {
          resolve([]);
        });
      });
    },   
    selectDicConfirm(e) {
      if (this.dicKeyWords == this.$u.dic.DIC_KEYS.S_SYS_YES_NO) { 
        this.involvedForm.pretendStr = e[0].label;
        this.involvedForm.pretend = e[0].extra.bcbCode;
      }else if(this.dicKeyWords == this.$u.dic.DIC_KEYS.S_SYS_IS_ACTIVE){
        this.involvedForm.statusStr = e[0].label;
        this.involvedForm.status = e[0].extra.bcbCode;
      }
    },  
    // 确认 
    confirm(){
      let self = this;
      this.$refs.uForm.validate(valid => {
        if (valid) {
          let {...params} = self.involvedForm;
          let ids = [];
          if(this.fileList.length > 0){
            this.fileList.forEach((item) => {
              ids.push(item.gfiId);
            });
            params.photo = ids.join(',');
          }
          caseService.saveOrPlane(params).then(res => {
            if(res.success){
              this.$u.success('保存成功',2000,() => {
                self.backPrev({
                  paramKey: "formItem",
                  param :{
                    type:'aviation',
                  },
                });
              });
            }else{
              this.$u.toast(res.msg);
            }
          }).catch(err => {
            this.$u.toast(err);
          })
        } 
      });
    },
    // 上传/删除图片事件
    changeUpload(list, key) {
      if (list.length > 0) {
        this.fileList = [...list,];
      } else {
        this.fileList = [];
      }
    },
    changeDate(type, e) {
      this.involvedForm[type] = this.$u.date(e.timestamp, 'yyyy-mm-dd hh:MM:ss');
    },
  },
}
</script>

<style lang="scss" scoped>
@import "../../case_common.scss";
.page{ padding:0; }
.logi-addr{
 display: flex;
 flex-direction: column;
 width: 100%;
}
.secion-title{
	font-size: .9rem;
	font-weight: 500;
	padding: 30rpx 0px 20rpx;
}
.u-sub-btn{
	width: 99%;
}
</style>

